<style>
	.img
	{
		cursor:move;
		border:2px solid #fff;
	}
	.checked_img
	{
		border:2px solid blue;
	}
	.float_item
	{
		margin:2px;
		float:left;
	}
</style>

<script src="js/uimouse.js"></script>
<script src="js/uisortable.js"></script>

<div class="toolbar" >
	<button onclick="edit_images()">{EDIT}</button>&nbsp;
	<button onclick="delete_images()">{DELETE}</button>&nbsp;
    <button onclick="check_all();">{CHECK_ALL}</button>&nbsp;
	<button onclick="inverse();">{CHECK_ANTI}</button>&nbsp;
	<button onclick="remove_from_album();">{REMOVE_FROM_ALBUM}</button>&nbsp;
	<button onclick="save_album();" id='save_button'>{SAVE_ALBUM}</button>
</div>

<div id='wraper'>
<div id="images_table" style="">
<!-- BEGIN album_images -->
<div class="float_item" photo_id="{photo_id}" style="cursor:move;width:64px; height:64px; background-color:lightblue;">
	<span onclick="" class='img' id='img_img_{photo_id}' admin="img" style="display:block;width:60px;height:60px;background:#eee url(image.php?max=60&path={small}) 50% 50% no-repeat"> 
		<input type="checkbox" name="img_check_{photo_id}" admin="check" id="img_check_{photo_id}" class="image_checkbox" style="display:none" />
		</span>
</div>
<!-- END -->
</div>
</div>

<div style="height:10px;width:30px;clear:both;">
</div>
<script>
$(function()
{
	load('view/admin/js/photo.js');
	$("#images_table").sortable({ items: "div" });
});
function edit_images()
{
	var ids = get_checked();
	if (ids == '')
	{
		alert('{NO_CHECKED_IMAGES}');
		return;
	}
	window.location = "admin.php?p=photo_edit&ids="+ids;
}

function delete_images(ids)
{
	if (!ids) ids = get_checked();
	if (ids == '')
	{
		alert('{NO_CHECKED_IMAGES}');
		return;
	}
	if (!confirm('{DELETE_COMFIRM}')) return;
	if (!confirm('{DELETE_COMFIRM2}')) return;
	$.post("admin.php?p=ajax&m=delete&table=photo&ids="+ids,{ },function(ids)
	{
		var arr = ids.split(',');
		for(i=0;i<arr.length;i++)
		{
			$('#img_img_'+arr[i]).parents('.float_item').fadeOut('fast',function()
			{
				this.parentNode.removeChild(this);
			});
		}
	});
}

function remove_from_album()
{
	var ids = get_checked();
	if (ids == '')
	{
		alert('{NO_CHECKED_IMAGES}');
		return;
	}
	var arr = ids.split(',');
	for(i=0;i<arr.length;i++)
	{
		$('#img_img_'+arr[i]).parents('.float_item').fadeOut(300,function()
		{
			this.parentNode.removeChild(this);
		});
		setTimeout("save_album()",500);
	}
}

function save_album()
{
	if ($('#save_button').attr('disabled')) return;
	var ids = [];
	$('.float_item').each(function()
	{
		ids.push($(this).attr('photo_id'));
	});
	ids = ids.join();
	$('#save_button').attr('disabled','disabled').html('{SAVING}');
	$.post("admin.php?p=photo_album&m=update&album_id={this_album.album_id}",{ ids:ids},function(s)
	{
		if (s!='success') alert(s);
		$('#save_button').html('{SAVED}');
		setTimeout("$('#save_button').removeAttr('disabled').html('{SAVE_ALBUM}')",1500);
	});
}
</script>